<template>
	<view class="" style="width: 100%;">
		<u-search
			:inputStyle="{ fontSize: '22rpx' }"
			inputAlign="center"
			height="28"
			shape="square"
			clearabled
			:placeholder="placeholder"
			bgColor="#fff"
			:actionStyle="actionStyle"
			borderColor="#D2D2D2"
			:searchIconColor="color"
			searchIconSize="25"
			placeholderColor="#999999"
			v-model="searchV"
			:disabled="disabled"
			:showAction="true"
			:actionText="actionText"
			@search="search"
			@blur="blur"
			@clear="clear"
			@focus="focus"
			@custom="search"
		></u-search>
	</view>
</template>

<script>
export default {
	props: {
		disabled: {
			type: Boolean,
			default: false
		},
		placeholder: {
			type: String,
			default: '请输入您想要搜索的内容'
		},
		searchVal: {
			type: String,
			default: ''
		},
		color: {
			type: String,
			default: '#CF1526'
		},
		actionText:{
			type: String,
			default: '搜索'
		}
	},
	data() {
		return {
			searchV: '',
			isChange: true,
			actionStyle: {
				background: this.color,
				color: '#ffffff',
				// marginLeft: '-10rpx',
				width: '120rpx',
				height: '58rpx',
				lineHeight: '58rpx',
				borderRadius: '10rpx'
			}
		};
	},
	watch: {
		searchVal(newV) {
			this.searchV = newV;
		}
	},
	methods: {
		search(value) {
			this.$emit('search', value);
			this.isChange = false;
		},
		blur(value) {
			// if (this.isChange) {
			// console.log('==2');
			// this.$emit('blur', value);
			// }
		},
		clear(value) {
			this.$emit('clear', value);
		},
		focus() {
			this.$emit('focus');
		}
	}
};
</script>

<style lang="scss" scoped>
::v-deep .u-search__content__input {
	font-size: 22rpx !important;
}
</style>
